* {
  padding: 0;
  margin: 0;
}
#box {
  margin: 20px;
}
#box .smallbox {
  position: relative;
  height: 418px;
  width: 418px;
}
#box .smallbox > img {
  height: 418px;
  width: 418px;
}

#box .bigbox {
  display: none;
  /* box-sizing: border-box; */
  position: absolute;
  left: 438px;
  top: 0; 
  height: 418px;
  width: 418px;
  border: 1px solid #ccc;
  overflow: hidden;
}
#box .bigbox img {
  position: relative;
}
#box .zoom {
  display: none;
  position: absolute;
  height: 218px;
  width: 218px;
  /* background: #35a; */
  opacity: 0.75;
  background-attachment: scroll;
  background-repeat: repeat;
  background-image: url(image/zoom.png);
}
#box .item {
  margin-top: 20px;
  font-size: 0;
}
#box .item img {
  height: 60px;
  width: 60px;
  margin-right: 6px;
  border:2px solid #fff;
}

#box .item .borderhover {
  height: 60px;
  width: 60px;
  margin-right: 6px;
  border:2px solid #000;
}